Multiple Page คือ การเขียนโปรแกรมแต่ละหน้าไว้ในไฟล์เดียวกัน โดยประโยชน์ของการทำ Multiple Page มีดังนี้
1. ความเร็ว การเขียนโปรแกรมไว้ในไฟล์เดียวกันจะช่วยเพิ่มความเร็วในการโหลดข้อมูลในแต่ละหน้า (แต่อาจจะช้าตอนโหลดครั้งแรก เพราะทุก ๆ หน้าในไฟล์นั้นจะถูกโหลดขึ้นมาพร้อมกัน)
2. ครอบคลุมส่วนที่เหมือนกันไว้ในหน้าเดียวกัน เช่น หน้าสินค้า และหน้ารายละเอียดสินค้า เป็นต้น
3. สร้างความยืดหยุ่น และสะดวกในการควบคุมการกระทำบางอย่างภายในไฟล์เดียวกัน
ตัวอย่างโปรแกรม
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" type="text/css" href="css/default/jquery.mobile.css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.mobile.js"></script>
<script type="text/javascript" src="js/cordova-1.9.0.js"></script>
</head>
<body>
<div data-role="page" id="main">
<div data-role="header"><h1>My First App</h1></div>
<div align="center" data-role="content">Hello, JQuery Mobile :)
<a href="#aboutus">About US</a></div></div>
<div data-role="page" id="aboutus">
<div data-role="header"><h1>About US</h1></div>
<div align="center" data-role="content">amplysoft :)</div>
</div>
</body>
</html>
อธิบายโปรแกรม
1. การทำ Multiple Page มีหลักการที่ง่าย เพียงแค่ระบุ id ที่ต้องการพร้อมกับ data-role="page"
2. ฝั่ง Page ที่มีลิงก์ นั้น ให้ระบุ <a href='#id'> ที่ต้องการ เพื่อโหลด Page นั้น ๆ ขึ้นมา
ผลลัพธ์
ทดสอบโปรแกรมโดยการกดคลิก ลิงก์ About US โปรแกรมจะทำการโหลดหน้า About US ขึ้นมาดังรูป
